<bit-simple-dialog>
  <div bitDialogIcon>
    <i class="bwi bwi-shield bwi-3x" aria-hidden="true"></i>
  </div>
  <div bitDialogTitle>Bitwarden</div>
  <div bitDialogContent>
    <p>&copy; Bitwarden Inc. 2015-{{ year }}</p>
    <p>{{ "version" | i18n }}: {{ version }}</p>
    <ng-container *ngIf="serverConfig$ | async as serverConfig">
      <p *ngIf="isCloud">
        {{ "serverVersion" | i18n }}: {{ this.serverConfig?.version }}
        <span *ngIf="!serverConfig.isValid()">
          ({{ "lastSeenOn" | i18n: (serverConfig.utcDate | date: "mediumDate") }})
        </span>
      </p>

      <ng-container *ngIf="!isCloud">
        <ng-container *ngIf="serverConfig.server">
          <p>
            {{ "serverVersion" | i18n }} <small>({{ "thirdParty" | i18n }})</small>:
            {{ this.serverConfig?.version }}
            <span *ngIf="!serverConfig.isValid()">
              ({{ "lastSeenOn" | i18n: (serverConfig.utcDate | date: "mediumDate") }})
            </span>
          </p>
          <div>
            <small>{{ "thirdPartyServerMessage" | i18n: serverConfig.server?.name }}</small>
          </div>
        </ng-container>

        <p *ngIf="!serverConfig.server">
          {{ "serverVersion" | i18n }} <small>({{ "selfHostedServer" | i18n }})</small>:
          {{ this.serverConfig?.version }}
          <span *ngIf="!serverConfig.isValid()">
            ({{ "lastSeenOn" | i18n: (serverConfig.utcDate | date: "mediumDate") }})
          </span>
        </p>
      </ng-container>
    </ng-container>
  </div>
  <div bitDialogFooter>
    <button bitButton bitDialogClose buttonType="primary" type="button">
      {{ "close" | i18n }}
    </button>
  </div>
</bit-simple-dialog>
